/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/

* { margin: 0; padding: 0; }
html { overflow-y: scroll; }
body { font: 12px/1.4 Helvetica, sans-serif; background: #333; color: #333; }
.group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.group { display: inline-block; clear: both; }
/* start commented backslash hack \*/ * html .group { height: 1%; } .group { display: block; } /* close commented backslash hack */
article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; }
a:focus {
	outline: 0; 
	}

#page-wrap { 
    width: 500px; margin: 40px auto 5px; background: #91c7ff; 
    padding: 8px;
    background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc));
	background: -moz-linear-gradient(top,  #eee,  #ccc);
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
}

#main-content { padding: 14px; }

h1 { font: bold 32px Helvetica, Arial, Sans-Serif; letter-spacing: -1px; padding: 14px; color: #333; text-shadow: 1px 1px 1px white; }
p { margin: 0 0 15px 0; }
 
nav ul { 
    list-style: none; background: #154c85; padding: 5px 20px; width: 478px; position: relative; 
    left: -9px;
}
nav ul li { display: inline; }
nav ul li a {
	display: block;
	float: left;
	border-top: 1px solid #96d1f8;
	background: #3e779d;
	background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d));
	background: -moz-linear-gradient(top,  #65a9d7,  #3e779d);
	height: 17px;
	padding: 0 10px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: rgba(0,0,0,1) 0 1px 3px;
	-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
	text-shadow: rgba(0,0,0,.4) 0 1px 0;
	-webkit-text-stroke: 1px transparent;
	font: bold 11px/16px "Lucida Grande", "Verdana", sans-serif;
	color: rgba(255,255,255,.85);
	text-decoration: none; 
	margin: 0 5px 0 0;
}
nav ul li a:hover {
	border-top: 1px solid #4789b4;
	background: #28597a;
	background: -webkit-gradient(linear, left top, left bottom, from(#3d789f), to(#28597a));
	background: -moz-linear-gradient(top,  #3d789f,  #28597a);
	color: rgba(255,255,255,.85); 
}	
nav ul li a:active, nav ul li a.current {
	border-top-color: #245779;
	background: #1b435e;
	position: relative;
	top: 1px; 
}

footer { color: #999; margin: 0 auto; width: 500px; }



table {
  display:table; 
  font-family:verdana, arial, sans-serif; 
   
  line-height:1.7em; 
  background:#888; 
  border:10px solid #eee;
  } 

tbody {
  display:table-row-group;
  }
tr {
  display:table-row; 
  padding:0.5em; 
  background:#fff; 
  border:10px solid #aaa; 
  border-width:1px 200px 0 50px; 
  border-color:#000 #888 #000 #888; 
  margin:2px 25px; 
  width:300px;
  } 
tr.odd {
  background:#eee;
  }
td, th {
  display:table-cell; 
  padding:0.2em;
  }
table, tbody, tr, td, th {
  /*display:block;*/ 
  } 
thead, tfoot {
  display:none;
  }

th {
  background:#abc;
  }
th a {
 display:block; 
 font-size:1.5em; 
 font-family:georgia, "times new roman", serif; 
 color:#000; 
 text-decoration:none; 
 border-left:5px solid #fff; 
 padding-left:1em;
 }
th a:hover {
  border-left:5px solid #000; 
  color:#fff;
  
  }
td {
  color:#00a;
  }
td:before {
  font-style:italic; 
  font-size:0.8em; 
  margin-right:1em; 
  color:#c00;
  }
td + td + td {
  color:#060;
  }
tr:hover {
  background:#bcd;
  }
  
  
  
 /*formulario*/
 #contactform {
    width: 450px;
    padding: 20px;
    background: #f0f0f0;
    overflow:auto;
    margin-top: 6px;
 
    /* Border style */
    border: 1px solid #cccccc;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px; 
 
    /* Border Shadow */
    -moz-box-shadow: 2px 2px 2px #cccccc;
    -webkit-box-shadow: 2px 2px 2px #cccccc;
    box-shadow: 2px 2px 2px #cccccc;
 
    }

label {
    font-family: Arial, Verdana;
    text-shadow: 2px 2px 2px #ccc;
    display: block;
    float: left; margin-right:15px;
    font-weight: bold;
    margin-right:10px;
    text-align: right;
    width: 120px;
    line-height: 25px;
    font-size: 15px;
    }

.input{
    font-family: Arial, Verdana;
    font-size: 15px;
    padding: 5px;
    border: 1px solid #b9bdc1;
    width: 200px;
    color: #797979;
    }

.hint{
    display:none;
    }
 .field:hover .hint {
    position: absolute;
    display: block;
    margin: -30px 0 0 455px;
    color: #FFFFFF;
    padding: 7px 10px;
    background: rgba(0, 0, 0, 0.6);
 
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    }
.button{
    float: right; margin-left:15px;
    margin:10px 55px 10px 0;
    font-weight: bold;
    line-height: 1;
    padding: 6px 10px;
    cursor:pointer;
    color: #fff;
 
    text-align: center;
    text-shadow: 0 -1px 1px #64799e;
 
    /* Background gradient */
    background: #a5b8da;
    background: -moz-linear-gradient
       (top, #a5b8da 0%, #7089b3 100%);
    background: -webkit-gradient
       (linear, 0% 0%, 0% 100%,
       from(#a5b8da), to(#7089b3));
 
    /* Border style */
    border: 1px solid #5c6f91;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
 
    /* Box shadow */
    -moz-box-shadow: inset 0 1px 0 0 #aec3e5;
    -webkit-box-shadow: inset 0 1px 0 0 #aec3e5;
    box-shadow: inset 0 1px 0 0 #aec3e5;
    }

